<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="content">
    <video id="video_id3" controls autoplay></video>
    <span id="musicName"></span>
    <br>
    <button id="stop" onClick="stop()">停止</button>
    <br>
    <br>
    <button id="play3z" onClick="start3(['music/1.mp3', 'music/2.mp3', 'music/3.mp3'])">播放难度3-1</button>
    <button id="play3f" onClick="start3(['music/3.mp3', 'music/2.mp3', 'music/1.mp3'])">播放难度3-2</button>
    <br>
    <button id="play41" onClick="start3(['music/2.mp3', 'music/5.mp3'])">播放难度4-1</button>
    <button id="play42" onClick="start3(['music/3.mp3', 'music/6.mp3'])">播放难度4-2</button>
    <br>
    <button id="play51" onClick="start3(['music/7.mp3', 'music/2.mp3', 'music/1.mp3'])">播放难度5-1</button>
    <button id="play52" onClick="start3(['music/6.mp3', 'music/9.mp3'])">播放难度5-2</button>
    <br>
    <button id="play61" onClick="start3(['music/11.mp3', 'music/5.mp3', 'music/3.mp3'])">播放难度6-1</button>
    <button id="play62" onClick="start3(['music/12.mp3', 'music/13.mp3'])">播放难度6-2</button>
    <br>
    <button id="play71" onClick="start3(['music/15.mp3', 'music/13.mp3', 'music/2.mp3'])">播放难度7-1</button>
    <button id="play72" onClick="start3(['music/17.mp3', 'music/12.mp3', 'music/6.mp3'])">播放难度7-2</button>
    <br>
    <button id="play81" onClick="start3(['music/9.mp3', 'sleep','music/16.mp3'])">播放难度8-1</button>
    <button id="play82" onClick="start3(['music/8.mp3',  'music/18.mp3', 'music/5.mp3'])">播放难度8-2</button>
    <br>
    <button id="play91" onClick="start3(['music/20.mp3', 'music/18.mp3', 'music/16.mp3'])">播放难度9-1</button>
    <button id="play92" onClick="start3(['music/15.mp3','sleep', 'music/17.mp3', 'music/13.mp3'])">播放难度9-2</button>
    <br>
    <button id="play101" onClick="start3(['music/20.mp3', 'music/17.mp3', 'music/13.mp3'])">播放难度10-1</button>
    <button id="play102" onClick="start3(['music/19.mp3', 'sleep','music/16.mp3', 'music/15.mp3'])">播放难度10-2</button>
    <br>
    <button id="play111" onClick="start3(['music/17.mp3', 'music/16.mp3','sleep', 'music/9.mp3'])">播放难度11-1</button>
    <button id="play112" onClick="start3(['music/18.mp3', 'music/13.mp3', 'music/12.mp3'])">播放难度11-2</button>
    <br>
</div>

</body>
<script>
    var vList3z;
    var vLen;
    var curr = 0;
    var span = document.getElementById("musicName");
    var video = document.getElementById("video_id3");
    var flag = false;
    video.addEventListener('ended', function () {
            setTimeout(function () {
                play();
            }, 500);//延迟5000毫米

    });

    function start3(list,flag) {
        vLen = list.length;
        curr = 0;
        vList3z = list;
        play();

    }

    function play() {
        if(vList3z[curr] =='sleep'){
            setTimeout(function () {
               curr++;
                video.src = vList3z[curr];
                span.innerText = vList3z[curr];
                video.load();
                video.play();
                curr++;
                if (curr >= vLen) {
                    curr = 0; //重新循环播放
                }

            }, 1000);//延迟5000毫米
        }else{
            video.src = vList3z[curr];
            span.innerText = vList3z[curr];
            video.load();
            video.play();
            curr++;
            if (curr >= vLen) {
                curr = 0; //重新循环播放
            }
        }




    }

    function stop() {
        document.getElementById("video_id3").src = "";
    }

</script>
</html>